<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" debug="true">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>MOOdalBox playground</title>
<link href="css/moodalbox.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/mootools.js"></script>
<script type="text/javascript" src="js/moodalbox.js"></script>
</head>

<body>
<style type="text/css">
body {
font: medium Verdana, Arial, Helvetica, sans-serif;
background-color: #222;
color: #CCC;
}
a {
color: #6C0;
}
#floater {
	float: right;
	border: 1px solid #FFF;
}
</style>
<div id="floater">
	<select>
		<option>let's see selects</option>
		<option>let's see selects</option>
		<option>let's see selects</option>
	</select>
	<br />
	<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="200" height="200" id="flash_test" align="middle">
<param name="allowScriptAccess" value="sameDomain" />
<param name="wmode" value="paque" />
<param name="movie" value="flash_test.swf" />
<param name="quality" value="autolow" />
<param name="bgcolor" value="#99cc00" />
<embed src="flash_test.swf" quality="autolow" wmode="opaque" bgcolor="#99cc00" width="200" height="200" name="flash_test" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>
</div>
<p>Here's where you get to play with the latest version of moodalbox ;) (currently 1.3 &beta;5)<br />
You may also want to check the <a href="http://www.e-magine.ro/moodalbox/">MOOdalBox original blog post / homepage</a> as well.</p>
		The page we're loading is about 100Kb, so you can see it loading.<br />
		<a href="moodalbox_test_ajax.html" rel="moodalbox" title="Default MOOdalBox, sized at 500x400 px"><strong>open MOOdalBox (default)</strong></a><br />
		<a href="moodalbox_test_ajax.html" rel="moodalbox fullscreen" title="Fullscreen MOOdalBox (actually, it should be called &quot;full-viewport MOOdalBox&quot;)"><strong>open MOOdalBox fullscreen</strong></a><br />
		<a href="moodalbox_test_ajax.html" rel="moodalbox 60% 80%" title="MOOdalBox sized using percentages 60% x 80%"><strong>open MOOdalBox 60% x 80%</strong></a><br />
		<a href="moodalbox_test_ajax.html" rel="moodalbox 50%" title="MOOdalBox using percentages, only one dimension specified, defaults to both width and height"><strong>open MOOdalBox 50%</strong></a><br />
		<a href="moodalbox_test_ajax.html" rel="moodalbox 300px" title="MOOdalBox using a px size, only one dimension specified, defaults to both width and height"><strong>open MOOdalBox 300px</strong></a><br />
		<a href="moodalbox_test_ajax.html" rel="moodalbox 50% 300px" title="MOOdalBox sized using percentage and px sizes alternatively"><strong>open MOOdalBox 50% 300px</strong></a><br />
		<a href="moodalbox_test_ajax_AAA.html" rel="moodalbox ERROR" title="MOOdalBox that points to an inexistent file and gets a 404"><strong>open MOOdalBox error</strong></a><br /><br />
		<a href="#" onclick="return MOOdalBox.config({resizeDuration: 1000});">reconfigure MOOdalBox on the fly: <code>MOOdalBox.config({resizeDuration: 1000});</code></a><br /><br />
		<a href="moodalbox_test_ajax.html" rel="moodalbox 50% wizard" title="MOOdalBox forced in wizard mode (you may also call it &quot;help mode&quot; - it forces links and forms to open inside the same MOOdalBox)"><strong>open moodalbox 50% wizard mode</strong></a><br />
		<form action="moodalbox_test_form_receiver.php" method="post" rel="moodalbox">A form using post..<br />
<textarea name="sText" cols="20" rows="3" onfocus="this.select()">pass some text to a form inside a default MOOdalBox</textarea><br />
<input name="" type="submit" value="send it" /></form>
		<form action="moodalbox_test_form_receiver.php" method="get" rel="moodalbox 60%">A form using get..<br />
<textarea name="sText" cols="20" rows="3" onfocus="this.select()">pass some text to a form inside a sized MOOdalBox</textarea><br />
<input name="" type="submit" value="send it" /></form>
		<form action="moodalbox_test_form_wizard.php" method="post" rel="moodalbox wizard">A form using post, forced in wizard mode..<br />
<textarea name="sText" cols="20" rows="3" onfocus="this.select()">pass some text to a form inside a moodalbox</textarea><br />
<input name="" type="submit" value="send it" /></form>
        <p>Mauris est turpis, commodo sed, sodales sit amet, pretium vitae, dui. Nunc aliquam, nisl eu fringilla feugiat, eros felis sodales odio, ac varius sapien lacus ac neque. Aenean convallis tincidunt metus. Curabitur faucibus ornare felis. Etiam facilisis varius erat. Proin malesuada rutrum libero. Duis quis neque. Donec auctor libero et lorem. Proin sed mauris in augue lacinia venenatis. Suspendisse rhoncus. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse mollis, augue sed dictum iaculis, lectus augue ullamcorper odio, quis tincidunt magna neque nec lectus. Donec id sapien. Morbi ac dolor vel turpis consectetuer hendrerit. Cras metus dolor, pellentesque eu, egestas ut, condimentum nec, quam. Nam volutpat porta ipsum. Suspendisse dictum. Nam scelerisque convallis lorem. Aliquam interdum luctus odio. Proin elementum elementum arcu. </p>
        <p>Curabitur nisi. Maecenas tincidunt justo eu mi viverra vulputate. Quisque id enim. Suspendisse eros. Nulla ultricies pharetra leo. Quisque ipsum tortor, bibendum quis, sodales in, imperdiet vitae, justo. Curabitur ultricies velit et erat. Suspendisse nonummy porttitor dui. In vitae lorem eu enim tristique feugiat. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Etiam eleifend ultricies mauris. </p>
        <p>Morbi a purus. Maecenas velit. Donec gravida suscipit massa. Proin aliquet, dui vel pulvinar facilisis, purus elit condimentum quam, nec sodales dui nisl et lorem. Morbi ullamcorper, lacus eu egestas accumsan, orci nunc sodales nisi, ut placerat sapien quam nec purus. Aliquam erat volutpat. Donec scelerisque pulvinar mauris. Praesent in ligula quis tellus congue tristique. Suspendisse et tellus ac lorem vulputate nonummy. Etiam tellus sapien, rhoncus sed, porttitor quis, tempus accumsan, leo. Donec sed lacus. Curabitur vitae eros vel mi consectetuer volutpat. Vivamus ullamcorper ligula vel turpis. Ut nonummy iaculis justo. Praesent sapien libero, posuere sed, euismod eget, ullamcorper at, arcu. Pellentesque dolor lorem, elementum sed, blandit at, dignissim mattis, tortor. Nullam a diam vitae tortor congue vestibulum. Aliquam erat volutpat. Integer id risus ac augue porta tincidunt. Maecenas tincidunt erat dignissim nisi. </p>
        <p>Mauris est turpis, commodo sed, sodales sit amet, pretium vitae, dui. Nunc aliquam, nisl eu fringilla feugiat, eros felis sodales odio, ac varius sapien lacus ac neque. Aenean convallis tincidunt metus. Curabitur faucibus ornare felis. Etiam facilisis varius erat. Proin malesuada rutrum libero. Duis quis neque. Donec auctor libero et lorem. Proin sed mauris in augue lacinia venenatis. Suspendisse rhoncus. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse mollis, augue sed dictum iaculis, lectus augue ullamcorper odio, quis tincidunt magna neque nec lectus. Donec id sapien. Morbi ac dolor vel turpis consectetuer hendrerit. Cras metus dolor, pellentesque eu, egestas ut, condimentum nec, quam. Nam volutpat porta ipsum. Suspendisse dictum. Nam scelerisque convallis lorem. Aliquam interdum luctus odio. Proin elementum elementum arcu. </p>
        <p>Curabitur nisi. Maecenas tincidunt justo eu mi viverra vulputate. Quisque id enim. Suspendisse eros. Nulla ultricies pharetra leo. Quisque ipsum tortor, bibendum quis, sodales in, imperdiet vitae, justo. Curabitur ultricies velit et erat. Suspendisse nonummy porttitor dui. In vitae lorem eu enim tristique feugiat. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Etiam eleifend ultricies mauris. </p>
        <p>Morbi a purus. Maecenas velit. Donec gravida suscipit massa. Proin aliquet, dui vel pulvinar facilisis, purus elit condimentum quam, nec sodales dui nisl et lorem. Morbi ullamcorper, lacus eu egestas accumsan, orci nunc sodales nisi, ut placerat sapien quam nec purus. Aliquam erat volutpat. Donec scelerisque pulvinar mauris. Praesent in ligula quis tellus congue tristique. Suspendisse et tellus ac lorem vulputate nonummy. Etiam tellus sapien, rhoncus sed, porttitor quis, tempus accumsan, leo. Donec sed lacus. Curabitur vitae eros vel mi consectetuer volutpat. Vivamus ullamcorper ligula vel turpis. Ut nonummy iaculis justo. Praesent sapien libero, posuere sed, euismod eget, ullamcorper at, arcu. Pellentesque dolor lorem, elementum sed, blandit at, dignissim mattis, tortor. Nullam a diam vitae tortor congue vestibulum. Aliquam erat volutpat. Integer id risus ac augue porta tincidunt. Maecenas tincidunt erat dignissim nisi. </p>
        <p>Mauris est turpis, commodo sed, sodales sit amet, pretium vitae, dui. Nunc aliquam, nisl eu fringilla feugiat, eros felis sodales odio, ac varius sapien lacus ac neque. Aenean convallis tincidunt metus. Curabitur faucibus ornare felis. Etiam facilisis varius erat. Proin malesuada rutrum libero. Duis quis neque. Donec auctor libero et lorem. Proin sed mauris in augue lacinia venenatis. Suspendisse rhoncus. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse mollis, augue sed dictum iaculis, lectus augue ullamcorper odio, quis tincidunt magna neque nec lectus. Donec id sapien. Morbi ac dolor vel turpis consectetuer hendrerit. Cras metus dolor, pellentesque eu, egestas ut, condimentum nec, quam. Nam volutpat porta ipsum. Suspendisse dictum. Nam scelerisque convallis lorem. Aliquam interdum luctus odio. Proin elementum elementum arcu. </p>
        <p>Curabitur nisi. Maecenas tincidunt justo eu mi viverra vulputate. Quisque id enim. Suspendisse eros. Nulla ultricies pharetra leo. Quisque ipsum tortor, bibendum quis, sodales in, imperdiet vitae, justo. Curabitur ultricies velit et erat. Suspendisse nonummy porttitor dui. In vitae lorem eu enim tristique feugiat. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Etiam eleifend ultricies mauris. </p>
        <p>Morbi a purus. Maecenas velit. Donec gravida suscipit massa. Proin aliquet, dui vel pulvinar facilisis, purus elit condimentum quam, nec sodales dui nisl et lorem. Morbi ullamcorper, lacus eu egestas accumsan, orci nunc sodales nisi, ut placerat sapien quam nec purus. Aliquam erat volutpat. Donec scelerisque pulvinar mauris. Praesent in ligula quis tellus congue tristique. Suspendisse et tellus ac lorem vulputate nonummy. Etiam tellus sapien, rhoncus sed, porttitor quis, tempus accumsan, leo. Donec sed lacus. Curabitur vitae eros vel mi consectetuer volutpat. Vivamus ullamcorper ligula vel turpis. Ut nonummy iaculis justo. Praesent sapien libero, posuere sed, euismod eget, ullamcorper at, arcu. Pellentesque dolor lorem, elementum sed, blandit at, dignissim mattis, tortor. Nullam a diam vitae tortor congue vestibulum. Aliquam erat volutpat. Integer id risus ac augue porta tincidunt. Maecenas tincidunt erat dignissim nisi. </p>
        <p>Mauris est turpis, commodo sed, sodales sit amet, pretium vitae, dui. Nunc aliquam, nisl eu fringilla feugiat, eros felis sodales odio, ac varius sapien lacus ac neque. Aenean convallis tincidunt metus. Curabitur faucibus ornare felis. Etiam facilisis varius erat. Proin malesuada rutrum libero. Duis quis neque. Donec auctor libero et lorem. Proin sed mauris in augue lacinia venenatis. Suspendisse rhoncus. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse mollis, augue sed dictum iaculis, lectus augue ullamcorper odio, quis tincidunt magna neque nec lectus. Donec id sapien. Morbi ac dolor vel turpis consectetuer hendrerit. Cras metus dolor, pellentesque eu, egestas ut, condimentum nec, quam. Nam volutpat porta ipsum. Suspendisse dictum. Nam scelerisque convallis lorem. Aliquam interdum luctus odio. Proin elementum elementum arcu. </p>
        <p>Curabitur nisi. Maecenas tincidunt justo eu mi viverra vulputate. Quisque id enim. Suspendisse eros. Nulla ultricies pharetra leo. Quisque ipsum tortor, bibendum quis, sodales in, imperdiet vitae, justo. Curabitur ultricies velit et erat. Suspendisse nonummy porttitor dui. In vitae lorem eu enim tristique feugiat. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Etiam eleifend ultricies mauris. </p>
        <p>Morbi a purus. Maecenas velit. Donec gravida suscipit massa. Proin aliquet, dui vel pulvinar facilisis, purus elit condimentum quam, nec sodales dui nisl et lorem. Morbi ullamcorper, lacus eu egestas accumsan, orci nunc sodales nisi, ut placerat sapien quam nec purus. Aliquam erat volutpat. Donec scelerisque pulvinar mauris. Praesent in ligula quis tellus congue tristique. Suspendisse et tellus ac lorem vulputate nonummy. Etiam tellus sapien, rhoncus sed, porttitor quis, tempus accumsan, leo. Donec sed lacus. Curabitur vitae eros vel mi consectetuer volutpat. Vivamus ullamcorper ligula vel turpis. Ut nonummy iaculis justo. Praesent sapien libero, posuere sed, euismod eget, ullamcorper at, arcu. Pellentesque dolor lorem, elementum sed, blandit at, dignissim mattis, tortor. Nullam a diam vitae tortor congue vestibulum. Aliquam erat volutpat. Integer id risus ac augue porta tincidunt. Maecenas tincidunt erat dignissim nisi. </p>
        <p>Maecenas dapibus. Morbi bibendum elementum quam. Donec egestas enim sed nulla. Proin aliquam dolor non nunc. Curabitur a metus et augue pharetra feugiat. Sed nisi elit, vulputate vitae, dignissim et, posuere vel, enim. Curabitur pretium nunc id odio. Nam in urna id nisi feugiat commodo. Proin molestie. Etiam dignissim adipiscing quam.XXX AAA BBB CCC DDD EEE FFF GGG HHH</p>
</body>
</html>
